import 'package:flutter/material.dart';
import 'package:flutter_axrjc/datasource/network/api/UserApi.dart';
import 'package:flutter_axrjc/routes.dart';
import 'package:flutter_axrjc/util/Util.dart';
import 'package:flutter_axrjc/widget/custom_radio.dart';
import 'package:flutter_axrjc/widget/custom_selection.dart';
import 'package:flutter_axrjc/widget/custom_text_field.dart';
import 'package:flutter_axrjc/widget/dialog.dart';
import 'package:get/get.dart';

import 'logic.dart';

class ProfilePage extends StatelessWidget {
  const ProfilePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final logic = Get.find<ProfileLogic>();
    final state = Get.find<ProfileLogic>().state;

    return Scaffold(
      backgroundColor: const Color(0xffF3F6F9),
      appBar: AppBar(
        backgroundColor: Colors.white,
        foregroundColor: Colors.black,
        titleSpacing: -10,
        elevation: 0,
        centerTitle: true,
        title: const Text(
          "个人信息",
          style: TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
        ),
        actions: [
          TextButton(
              onPressed: logic.save,
              child: const Text(
                "保存",
                style: TextStyle(color: Colors.orange),
              ))
        ],
      ),
      body: Column(
        children: [
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Container(
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(10)),
              margin: const EdgeInsets.all(10),
              padding: const EdgeInsets.symmetric(vertical: 15, horizontal: 10),
              child: Column(
                children: [
                  InkWell(
                    onTap: logic.updateAvatar,
                    child: Padding(
                      padding: const EdgeInsets.symmetric(vertical: 8),
                      child: Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          const Text("头像"),
                          Row(
                            children: [
                              Obx(() {
                                return CircleAvatar(
                                  radius: 25,
                                  backgroundColor: Colors.white,
                                  backgroundImage: state.avatar.value == ""
                                      ? Image.asset('assets/defaultAvatar.png')
                                          .image
                                      : NetworkImage(state.avatar.value),
                                );
                              }),
                              const Icon(
                                Icons.keyboard_arrow_right_sharp,
                                color: Colors.grey,
                              )
                            ],
                          )
                        ],
                      ),
                    ),
                  ),
                  const SizedBox(
                    height: 10,
                  ),
                  Padding(
                    padding: const EdgeInsets.symmetric(vertical: 8),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        const Text("昵称"),
                        const SizedBox(
                          width: 10,
                        ),
                        Expanded(
                          child: Obx(() {
                            return CustomTextField(
                              style: const TextStyle(fontSize: 14),
                              value: state.nickname.value,
                              textAlign: TextAlign.end,
                              onChanged: (t) {
                                state.nickname.value = t;
                              },
                              inputDecoration: const InputDecoration(
                                  hintText: "请输入昵称",
                                  hintStyle: TextStyle(fontSize: 14),
                                  isCollapsed: true,
                                  isDense: true,
                                  border: InputBorder.none),
                            );
                          }),
                        ),
                        const Icon(
                          Icons.keyboard_arrow_right_sharp,
                          color: Colors.grey,
                        )
                      ],
                    ),
                  ),
                  Obx(() {
                    return CustomSelection(
                      '生日',
                      value: state.birthday.value,
                      onPressed: () {
                        showCustomDatePicker(onConfirm: (time, s) {
                          state.birthday.value = Util.date2String(time) ?? '';
                        });
                      },
                    );
                  }),
                  Padding(
                    padding: const EdgeInsets.symmetric(vertical: 8),
                    child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        const Text("地址"),
                        const SizedBox(
                          width: 10,
                        ),
                        Expanded(
                          child: Obx(() {
                            return CustomTextField(
                              style: const TextStyle(fontSize: 14),
                              value: state.address.value,
                              textAlign: TextAlign.end,
                              onChanged: (t) {
                                state.address.value = t;
                              },
                              inputDecoration: const InputDecoration(
                                  hintText: "请输入地址",
                                  hintStyle: TextStyle(fontSize: 14),
                                  isCollapsed: true,
                                  isDense: true,
                                  border: InputBorder.none),
                            );
                          }),
                        ),
                        const Icon(
                          Icons.keyboard_arrow_right_sharp,
                          color: Colors.grey,
                        )
                      ],
                    ),
                  ),
                  Obx(() {
                    return CustomRadio(
                      "性别",
                      [
                        ValueOption("男", '0'),
                        ValueOption("女", '1'),
                      ],
                      groupValue: state.gender.value,
                      labelStyle: const TextStyle(color: Colors.black),
                      onChanged: (o) {
                        state.gender.value = "$o";
                      },
                    );
                  }),
                ],
              ),
            ),
          ),
          const SizedBox(
            height: 10,
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: InkWell(
              onTap: () {
                Get.toNamed(MainRoutes.changePassword);
              },
              child: Container(
                  padding: const EdgeInsets.symmetric(vertical: 12),
                  decoration: BoxDecoration(
                      color: const Color(0xffDCDCDC).withAlpha(102),
                      borderRadius: BorderRadius.circular(20)),
                  child: const Center(
                    child: Text(
                      "修改密码",
                      style: TextStyle(color: Colors.orange, fontSize: 14),
                    ),
                  )),
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: InkWell(
              onTap: () {
                showCommonDialog(
                    content: "确定退出登录？",
                    onConfirm: () {
                      UserApi.logout();
                      // Get.back();
                    },
                    onCancel: () {
                      Get.back();
                    });
              },
              child: Container(
                  padding: const EdgeInsets.symmetric(vertical: 12),
                  decoration: BoxDecoration(
                      color: const Color(0xffDCDCDC).withAlpha(102),
                      borderRadius: BorderRadius.circular(20)),
                  child: const Center(
                    child: Text(
                      "退出登录",
                      style: TextStyle(color: Colors.red, fontSize: 14),
                    ),
                  )),
            ),
          ),
        ],
      ),
    );
  }
}
